<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/html">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <meta name="content-type" content="text/html; charset=UTF-8" />
    <title>申诉详情</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}" type="text/css" media="screen" />
    <script type="text/javascript" th:src="@{/jquery/jquery-1.12.4.min.js}"></script>
    <script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>

</head>
<body>


<div class="panel panel-default">
    <ol class="breadcrumb">
        <li><a href="/admin/appeal/">申诉列表</a></li>
        <li class="active">申诉详情</li>
    </ol>

    <div style="padding: 10px">
        <!-- Table -->
        <div class="row">
            <div class='col-sm-5'>
                <table class="table" style="border-top-width:0px;border: 1px solid #dddddd;">
                    <th:block th:if="${msg}">
                        <div class="alert alert-warning">
                            <a href="#" class="close" data-dismiss="alert">
                                &times;
                            </a>
                            <strong>提示:</strong><span th:text="${msg}"></span>
                        </div>
                    </th:block>
                    <th:block th:if="${respAppealDetail}">
                        <tr>
                            <td><span>用户账号:</span></td>
                            <td><span th:text="${respAppealDetail.mobile}"></span></td>
                        </tr>
                        <tr>
                            <td><span>申诉时间:</span></td>
                            <td><span th:text="${#dates.format(respAppealDetail.createTime,'yyyy-MM-dd HH:mm')}"></span></td>
                        </tr>
                        <tr>
                            <td><span>行程单号:</span></td>
                            <td><span th:text="${respAppealDetail.orderNo}"></span></td>
                        </tr>
                        <tr>
                            <td><span>车牌号码:</span></td>
                            <td><span th:text="${respAppealDetail.carNo}"></span></td>
                        </tr>
                        <tr>
                            <td><span>行程:</span></td>
                            <td><span th:text="${respAppealDetail.start+'--'+respAppealDetail.end}"></span></td>
                        </tr>
                        <tr>
                            <td><span>过路费:</span></td>
                            <td><span th:text="${respAppealDetail.amount}"></span></td>
                        </tr>
                        <tr>
                            <td><span>申诉问题:</span></td>
                            <td><span th:text="${respAppealDetail.appealDetail}"></span></td>
                        </tr>
                        <form id="updateForm" name="updateForm" method="get" action="/admin/appeal/insertReply">
                            <tr>
                                <td><span>原因:</span></td>
                                <td>
                                    <input type="hidden" id="appealId" name="appealId" th:value="${respAppealDetail.id}" class="form-control">
                                    <input type="hidden" id="travelOrderId" name="travelOrderId" th:value="${respAppealDetail.travelOrderId}" class="form-control">
                                    <input type="hidden" id="isAgree" name="isAgree" class="form-control">
                                    <th:block th:if="${respAppealDetail.status == 0}">
                                        <input id="reply" name="reply" class="form-control"></input>
                                    </th:block>
                                    <span th:if="${respAppealDetail.status == 1}" th:text="${respAppealDetail.reason}"></span>
                                    <span th:if="${respAppealDetail.status == 2}" th:text="${respAppealDetail.reason}"></span>
                                </td>
                            </tr>
                            <tr>
                                <td><span>状态:</span></td>
                                <td th:if="${respAppealDetail.status == 0}" th:text="待受理"></td>
                                <td th:if="${respAppealDetail.status == 1}" th:text="已退款"></td>
                                <td th:if="${respAppealDetail.status == 2}" th:text="已拒绝"></td>
                            </tr>
                            <tr th:if="${respAppealDetail.status == 0}">
                                <td><button type="button" class="btn btn-default" onclick="agreeSubmit();">退款</button></td>
                                <td><button type="button" class="btn btn-default" onclick="noagreeSubmit();">不同意</button></td>
                            </tr>
                        </form>
                    </th:block>
                </table>
            </div>
        </div>
    </div>
</div>

</body>
<script>
    function noagreeSubmit() {
        if(document.getElementById("reply").value.length == 0){
            alert("请填写不同意原因");
            return;
        }
        document.getElementById("isAgree").value = 0;
        document.updateForm.submit();
    }
    function agreeSubmit() {
        document.getElementById("isAgree").value = 1;
        document.updateForm.submit();
    }
</script>
</html>